<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>     
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>订单列表</title>
<jsp:include page="/layout/_css.jsp"/>
</head>
<body>
	<body class="gray-bg">
		<div class="wrapper wrapper-content animated fadeInRight">
			<div class="row">
				<div class="col-sm-12">
					  <div class="ibox float-e-margins">
					  	 <div class="ibox-title">
					  	 	<h5>订单列表</h5>
					  	 </div>
					  	 <div class="ibox-content">
			    			 <table id="table"></table>
					  	 	 <div class="btn btn-primary" onclick='deleteSelect()'>删除所选</div>
					  	 </div>
					  </div>
				</div>
			</div>	
		</div>
		<div id="updOrder" style="display: none;">
			<div class="wrapper wrapper-content animated fadeInRight">
				<div class="ibox-content">
					<form action="" method="get"
						class="form-horizontal">
						<input type="hidden" name="o_id">
						<div class="form-group">
							<label class="col-sm-2 control-label">预订人</label>
		
							<div class="col-sm-10">
								<input type="text" name="u_name" class="form-control"
									value="" readonly="readonly">
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-2 control-label">房间号码</label>
		
							<div class="col-sm-10">
								<input type="text" name="r_num" class="form-control"
									value="">
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-2 control-label">入住时间</label>
		
							<div class="col-sm-10">
								<input type="date" name="o_date" class="form-control"
									>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-2 control-label">入住天数</label>
		
							<div class="col-sm-10">
								<input type="text" name="o_days" class="form-control"
									>
							</div>
						</div>
						<div class="hr-line-dashed"></div>
						<div class="form-group">
							<div class="col-sm-4 col-sm-offset-2">
								<input class="btn btn-primary" type="button" onclick="updOrder()" value="提交">
								<input class="btn btn-white" type="button" onclick="closeLayer()" value="取消">
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</body>
</body>
<jsp:include page="/layout/_script.jsp"></jsp:include>
<script src="https://cdn.bootcss.com/bootstrap-table/1.12.1/bootstrap-table.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-table/1.12.1/locale/bootstrap-table-zh-CN.js"></script>
<script>
$('#table').bootstrapTable({
    url: '${ctx}/UserServlet/listAllOrder',
    columns: [
    	{
    	checkbox:true
    	},{
        field: 'u_name',
        title: '姓名',
        sortable:true
    }, {
        field: 'r_num',
        title: '房间号码'
    },{
        field: 'r_price',
        title: '房间价格'
    }, {
        field: 'o_date',
        title: '入住时间'
    }, {
        field: 'o_days',
        title: '入住天数'
    }, {
        field: 'o_price',
        title: '订单总额'
    }, {
    	field: 'caozuo',
        title: '操作',
        formatter:function(v1,v2,v3){
        	return ['<a class="like" href="javascript:void(0)" title="Like">',
                '<i class="fa fa-pencil"></i>',
                '</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;',
                '<a class="remove" href="javascript:void(0)" title="Remove">',
                '<i class="glyphicon glyphicon-remove"></i>',
                '</a>'].join('');
        },
        events:'caozuoEvents'
    }],
    pagination:true,
    pageSize:5,
    pageList:[1,5,10],
    search:true,
    showColumns:true,
    clickToSelect:true,
    sidePagination:'server',
    rowStyle:function(v,index){
    	var classes = ['active', 'success', 'info', 'warning', 'danger'];
        return {}; 
    }
});
window.caozuoEvents = {
		'click .like': function (e, value, row) {
			$('[name=o_id]').val(row.o_id);
			$('[name=u_name]').val(row.u_name);
        	$('[name=r_num]').val(row.r_num);
        	$('[name=o_date]').val(row.o_date);
        	$('[name=o_days]').val(row.o_days);
        	layer.open({
    			type:1,
    			content:$('#updOrder'),
    			area: ['800px', '400px'],
    			offset:'70px',
    			title:'订单信息修改',
    			fixed:true,
    		});
        },
        'click .remove': function (e, value, row) {
        	if(confirm('是否删除')){
	        	 $.get('${ctx}/UserServlet/removeOrderById',{'o_id':row['o_id']},function(r){
	        		 if(r){
	        			layer.msg('删除成功');
	        			$('#table').bootstrapTable('refresh');
	        		 }else{
	        			layer.msg('删除失败');
	        		 }
	        	 });
        	}
        }
    };

function deleteSelect(){
	arr = $('#table').bootstrapTable('getSelections');
	arr2 = [];
	for(i in arr){
		arr2.push(arr[i]['o_id']);
	}
	str = JSON.stringify(arr2);
	$.get('${ctx}/UserServlet/removeAllOrder',{'o_ids':str},function(r){
		if(r){
			layer.msg("删除了"+r+"行数据");
		    $('#table').bootstrapTable('refresh');
		}else{
			layer.msg("删除失败");
		}
	});	
};
function updOrder(){
	if(confirm('是否修改')){
		$.ajax({
			url:'${ctx}/UserServlet/updOrder',
			type:'post',
			data:{
				"o_id":$("[name=o_id]").val(),
				"r_num":$("[name=r_num]").val(),
				"o_date":$("[name=o_date]").val(),
				"o_days":$("[name=o_days]").val()
			},
			success:function(r){
				if(r){
					layer.closeAll();
					layer.msg("修改成功");
					time:5000;
				    $('#table').bootstrapTable('refresh');
				}else{
					layer.msg("修改失败");
				}
			}
		});
	}
}
function closeLayer(){
	layer.closeAll();
	$('#table').bootstrapTable('refresh');
}
</script>
</html>